<template>
  <div class="home-container">
  	<div class="wrap" ref="editor">
      <div class="header">
        欢迎使用wifi小程序
      </div>

      <div class="body">
        <div class="block" style="color: #1cef86;">
          <div class="title">安易连</div>
          <img class="image" src="https://cloudcampusapps.top/wifilink/anyLink/20210629103955.jpg" alt="安易连小程序码">
          <div class="desc">使用安易连小程序，只要扫一扫，就可以轻松上网、便捷无忧。</div>
        </div>
        <div class="block" style="color: #fa8a05;">
          <div class="title">易安连</div>
          <img class="image" src="https://cloudcampusapps.top/wifilink/anyLink/20210629104015.jpg" alt="易安连小程序码">
          <div class="desc">使用易安连小程序，您可以让您的店铺给顾客提供安全、便捷的无线网络。</div>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
import { screenSize } from '@/assets/js/utils'
import publicMess from '../utils/publicMess.js';
export default {
  name: 'Home',
  components: {},
  data() {
  	return {

  	}
  },
  computed: {
  	
  },
  created() {
    
  },
  mounted() {
    
    screenSize(this.$refs.editor);
  },
  methods: {
    
    
  }
}
</script>

<style lang="less" scoped>
.home-container {
	position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: #001254;
  .wrap {
    background: #001254 url('https://cloudcampusapps.top/wifilink/anyLink/20210629105331.jpg');
  }
}	
.header {
  width: 100%;
  text-align: center;
  color: #fff;
  font-size: 32px;
  line-height: 2;
  padding: 50px 0;
}
.body {
  width: 1000px;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
  background-color: rgba(255, 255, 255, 0.36);
  box-shadow: -2px -2px 10px 10px rgba(255, 255, 255, 0.575);
  padding: 20px 0;
  border-radius: 10px;
  .block {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 45%;
    padding: 5%;
    box-sizing: border-box;
    .title {
      font-size: 32px;
    }
    .image {
      width: 100%;
      margin: 30px auto;
    } 
    .desc {
      font-size: 24px;
      text-indent: 2em;
      line-height: 2;
    }
  }
}
</style>
